saucenao和trace.moe api的使用 |
您所在的位置:网站首页 › 识图 pixiv › saucenao和trace.moe api的使用 |
saucenao是一个很强大的识图网站。但是关于它api的使用,官网设置得挺不起眼的,一直容易被人忽视。 要注册账号获取api key,才能使用它的api。 注册:https://saucenao.com/user.php api key:https://saucenao.com/user.php?page=search-api 演示: //因为会出现跨域的问题,所以用后端node的方式请求 const axios = require('axios') async function fn(){ const data = await axios.get('https://saucenao.com/search.php',{ params:{ url: imageURL, db:999, api_key: ApiKey, output_type:2, numres: 3 } }) } fn() 参数说明 url(必填)https://的形式db(必填)999api_key(必填)output_type(选填 | 默认是0)返回数据的格式 0是html数据 1是xml数据 2是json数据numres(选填)请求返回的结果数量trace.moe是个强大的识别动画作品的网站。 api文档:https://soruly.github.io/trace.moe/#/ 首先是在html文件中放一张图片,然后创建canvas,将这张图片转成base64的数据。 图片最好使用本地图片测试,否则会出现跨域问题。 var img = document.querySelector("img"); var canvas = document.createElement("canvas"); canvas.width = img.naturalWidth; canvas.height = img.naturalHeight; var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
var baseImg = JSON.stringify({ image: canvas.toDataURL("image/jpeg", 0.8) }); 官方用的是fetch,我习惯用axios,而且用axios有个注意点,这里我就用axios演示一下。 import axios from 'axios' async function fn(){ try{ const data = await axios.post('https://trace.moe/api/search', baseImg, { headers:{ "Content-Type": "application/json" } }) console.log(data) }catch(e){ console.log(e) } } fn() axios的数据是直接传入数据的,而不是用params。要启动web服务器打开,也就是npm run serve 的状态下打开,才会发送请求。 用模块化导入有个问题就是要打包,嫌打包麻烦的还是用fetch把。 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |